<template>
  <div>
    <h1>{{ message }}</h1>
    <button @click="btnFn">反转世界</button>
  </div>
</template>

<script>
//点击翻转地球
//1、准备标签和变量初始值
//2、绑定点击事件
export default {
  data() {
    return {
      message: "Hello ,World",
    };
  },
  methods: {
    btnFn() {
      //3、转成数组
      let arr = this.message.split(""); //拆开['H','e','l','l',....]
      //4、数组翻转元素
      arr.reverse(); //翻转 ['d','l','r','',.....]
      //5、数组转回字符串
      this.message = arr.join("");
      //   (this.message = this.message.split("").reverse()), join("");
    },
  },
};
</script>

<style>
</style>